 /**
   * Copyright (c) 2017-2019 tencent, All rights reseved.
   * @fileoverview 评星
   * @author carllsun | carllsun@tencent.com
   * @version 1.0  | 2017-11-06 | carllsun    // 初始版本。
   * 
   * @param properties {Object}
   *     starNum {String | Number}  //(非必选) 评分, 默认值0分。
   *     starName {String}          //(非必选) 当在作为表单提交时，默认值是name=score，如果你有多个地方用到了评星，
   *                                //  需要手动传入starName，否则都为默认score将会只取最后一个值                               
   *     imageStarUrl {String}      //(非必选) 点亮的icon， 默认是组件自带的，当需要替换的时候直接写images的绝对位置即可。
   *     imageNoStarUrl {String}    //(非必选) 非点亮的icon， 默认是组件自带的，当需要替换的时候直接写images的绝对位置即可。
   *                                // 点亮和非点亮同时写
   *     isSelect {Boolean}         // 参数：是否有事件，当有事件的时候可以自由评分，当没有的时候为纯展示评分。
   *
   * @param data {Object}   //均为组件内部私有data属性
   *     stars {Array}     //用于渲染评星个数。默认数组长5.
   *     animationData    // 选中时的动画数据
   *     currentIndex     // 为了只有当前选中的元素才有动画
   *
   * @slot //该插槽用于在评星组件后边增加文案。本组件不提供样式，请自行根据自己的需求来写。默认无。
   * 
   * @event _emitEvents   //对组件外暴露的事件， 统一的命名方式为 wii + 组件名  + event 如: wiiRateEvent,
   *   that.triggerEvent('wiiRateEvent', starData) 攒不支持冒泡到父级组件。
   *   页面引用需要手动绑定该事件。自行处理。回调事件命名写法同意为： 组件名 + Callback,如： bind:wiiRateEvent="rateCallback" 
   *   
   * @example    // 典型的调用示例。
      
      1.
       默认评分为0，默认的icon样式///isSelect为 false  没有事件。因为小程序直接写is-select="false"会认为是真的
      <wii-rate class="fa" is-select="{{isSelect}}">
      </wii-rate>
      
      2.
       默认评分为0，默认的icon样式，后边带有文案
      <wii-rate bind:wiiRateEvent="rateCallback" class="fa">
        <view class="wii-rate-text">我是评星组件</view>
      </wii-rate>
      
      3.
       评分为4星，默认的icon样式，name的名字是score1, 后边带有文案
      <wii-rate star-num="4"  star-name="score1"   bind:wiiRateEvent="rateCallback" class="fa">
        <view class="wii-rate-text">我是评星组件</view>
      </wii-rate>

      4.
       评分为4星，自定义的icon样式，name的名字是score1, 后边带有文案
      <wii-rate star-num="4"  star-name="score1" image-star-url="/images/xxx/xxx.png"  
       image-star-url="/images/xxx/no-xxx.png"  bind:wiiRateEvent="rateCallback" class="fa">
        <view class="wii-rate-text">呵呵呵呵</view>
      </wii-rate>
   */

 Component({
   properties: {
     starNum: {
       type: String,
       value: 0
     },
     starName: {
       type: String,
       value: 'score'
     },
     imageStarUrl: {
       type: String,
       value: './images/star.png'
     },
     imageNoStarUrl: {
       type: String,
       value: './images/no-star.png'
     },
     isSelect: {
       type: Boolean,
       value: true
     }
   },
   data: {
     stars: [0, 0, 0, 0, 0],
     animationData: {},
     currentIndex: null
   },
   attached() {
     var starNum = this.data.starNum;
     var stars = this.convertToStarsArray(starNum);
     this.setData({
       stars: stars,
       starNum: starNum
     })

     this.animation = wx.createAnimation({
       duration: 1000,
       timingFunction: 'ease',
     })


   },
   ready() {

   },
   methods: {
     selectedTap: function(e) {
       var that = this;
       var index = e.currentTarget.dataset.index;

       //动画:上一次点亮stars的数量
       var starsSum = 0;
       for (var i = 0; i < that.data.stars.length; i++) {
         starsSum += that.data.stars[i];
       }


       var stars = that.convertToStarsArray(index);
       var starNum = index;


       that.setData({
         stars: stars,
         starNum: starNum
       });

       //动画: 当前点亮star才会有动画，已经点亮再次点击不会出现动画。
       if (starsSum < index) {
         that.animation.scale(1.4).opacity(0.3).step();
         that.setData({
           animationData: that.animation.export(),
           currentIndex: index
         });

         setTimeout(function() {
           that.animation.scale(1).opacity(1).step();
           that.setData({
             animationData: that.animation.export(),
             currentIndex: index
           })
         }, 200)
         this._emitEvents();
         return false;
       }

     },
     convertToStarsArray: function(stars) {
       if (stars == 'null') {
         stars = 0;
       }
       var num = stars.toString().substring(0, 1);
       var array = [];
       for (var i = 1; i <= 5; i++) {
         if (i <= num) {
           array.push(1);
         } else {
           array.push(0);
         }
       }
       return array;
     },
     _emitEvents: function() {
       var that = this;
       var starData = {
         stars: that.data.stars,
         starNum: that.data.starNum
       };
       that.triggerEvent('wiiRateEvent', starData);
     }
   }
 })